import { PageContainer } from '@ant-design/pro-layout';
import TbaleExplainMap from '@/components/TipsMap';
import { EllipsisOutlined, PlusOutlined } from '@ant-design/icons';
import type { ActionType, ProColumns } from '@ant-design/pro-components';
import { ProTable, TableDropdown, ProCard } from '@ant-design/pro-components';
import { Button, Dropdown, Menu, Space, Tag, message, Steps } from 'antd';
import React, { useRef } from 'react';
import request from 'umi-request';
import { Link, history } from 'umi';
import {
  ModalForm,
  ProForm,
  ProFormDateRangePicker,
  ProFormSelect,
  ProFormText,
  ProFormList,
} from '@ant-design/pro-components';

const { Step } = Steps;

const columns = [
  {
    title: '事务编号',
    dataIndex: '事务编号',
    // valueType: 'indexBorder',
    // width: 80,
  },
  {
    title: '事务名称',
    key: '事务名称',
    dataIndex: '事务名称',
    copyable: true,
    ellipsis: true,
  },
  // {
  //     title: '发起人范围',
  //     key: '发起人范围',
  //     dataIndex: '发起人范围',
  //     copyable: true,
  //     ellipsis: true,
  //     hideInSearch: true,
  // },
  {
    title: '创建时间',
    key: '创建时间',
    dataIndex: '创建时间',
    copyable: true,
    ellipsis: true,
    hideInSearch: true,
  },
  {
    title: '用途',
    key: '用途',
    dataIndex: '用途',
    copyable: true,
    ellipsis: true,
    hideInSearch: true,
  },
  {
    title: '备注',
    key: '备注',
    dataIndex: '备注',
    copyable: true,
    ellipsis: true,
    hideInSearch: true,
  },
  {
    title: '有效期',
    key: '有效期',
    dataIndex: '有效期',
    copyable: true,
    ellipsis: true,
    hideInSearch: true,
  },
  {
    title: '操作',
    valueType: 'option',
    key: 'option',
    render: (text: any, record: any) => {
      return (
        <Space>
          <a
            onClick={() => {
              history.push(
                `/SystemManage/CreateTransaction/${record?.事务编号}`,
              );
            }}
          >
            查看
          </a>
          <a>删除</a>
          <a>停用</a>
        </Space>
      );
    },
  },
];
const dataSource = [
  {
    事务编号: '1',
    事务名称: '事务名称1',
    抄送人: '抄送人1',
    事务创建时间: '2022-04-05',
    处理状态: '已读',
    事务状态: '审核中',
  },
  {
    事务编号: '2',
    事务名称: '事务名称2',
    抄送人: '抄送人2',
    事务创建时间: '2022-04-06',
    处理状态: '未读',
    事务状态: '通过',
  },
];
const waitTime = (time: number = 100) => {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve(true);
    }, time);
  });
};

export default () => {
  const actionRef = useRef<ActionType>();
  return (
    <PageContainer>
      <ProTable
        columns={columns}
        actionRef={actionRef}
        cardBordered
        dataSource={dataSource}
        rowKey="事务编号"
        search={{
          labelWidth: 'auto',
        }}
        pagination={{
          pageSize: 10,
          // onChange: (page) => console.log(page),
        }}
        dateFormatter="string"
        headerTitle="方向列表"
        toolBarRender={() => [
          <Button
            type="primary"
            onClick={() => {
              history.push('/SystemManage/CreateTransaction/new');
            }}
          >
            新建事务
          </Button>,
        ]}
      />
    </PageContainer>
  );
};
